<template>
  <!-- discernPopup：薅羊毛下单时需要ai识别图片中的信息 -->
  <u-popup :show="showFlag" mode="center" round="20" :closeOnClickOverlay="false" :safeAreaInsetBottom="false">
    <view class="popupBox">
      <view class="title">请上传相关信息</view>
      <template v-if="vailType == '3'">
        <template v-if="idcard">
          <view class="rowTitle">请验证本人身份证</view>
          <view class="iptBox">
            <text>姓名:</text>
            <input type="text" v-model="name" />
          </view>
          <view class="iptBox">
            <text>身份证号:</text>
            <input type="text" v-model="idcard" />
          </view>
        </template>
        <template v-else>
          <view class="rowTitle">请上传本人正面身份证</view>
          <ImgUpload :maxCount="1" @callback="callback1" />
        </template>
      </template>

      <!-- 上传本人B超单 -->
      <template v-if="vailType == '1'">
        <template v-if="Bc_code">
          <view class="iptBox">
            <text>门诊号:</text>
            <input type="text" v-model="Bc_code" />
          </view>
        </template>
        <template v-else>
          <view class="rowTitle">请上传本人B超单</view>
          <ImgUpload :maxCount="1" @callback="callback2" />
        </template>
      </template>

      <!-- 上传出生证明 -->
      <template v-if="vailType == '2'">
        <template v-if="rank_code">
          <view class="iptBox">
            <text>孩子姓名:</text>
            <input type="text" v-model="kid_name" />
          </view>
          <view class="iptBox">
            <text>出生证明编号:</text>
            <input type="text" v-model="rank_code" />
          </view>
        </template>
        <template v-else>
          <view class="rowTitle">请上传出生证明</view>
          <ImgUpload :maxCount="1" @callback="callback2" />
        </template>
      </template>

      <view class="btnBox">
        <text @click="backClick">返回</text>
        <text @click="subClick">确定</text>
      </view>
    </view>
  </u-popup>
</template>

<script>
import ImgUpload from '@/components/ImgUpload/ImgUpload.vue'
export default {
  name: 'DiscernPopup',
  data() {
    return {
      showFlag: false, // 显示弹出层
      name: null, //姓名
      idcard: null, //身份证号
      Bc_code: null, //B超单号
      kid_name: null, //孩子姓名
      rank_code: null //	出生证明编号
    }
  },
  components: {
    ImgUpload
  },
  props: {
    // 代表验证的类型 0=不验证,1=验证B超单,2=验证出生证明
    // 不为0的话身份证每次都得验证
    vailType: {
      require: true
    }
  },
  watch: {
    vailType(newValue, oldValue) {
      if (newValue == 0) this.showFlag = false
      else this.showFlag = true
    }
  },
  mounted() {},
  methods: {
    callback1(e) {
      console.log('自定义callback', e[0].url)
      this.ocrIdcardFun(e[0].url)
    },
    callback2(e) {
      console.log('自定义callback')
      this.ovrFileFun(e[0].url)
    },
    // 识别B超单/出生证明
    async ovrFileFun(file_url) {
      let res = await this.$api.ovrFile({
        file_url
      })
      if (this.vailType == '1') {
        const reg = RegExp(/门诊号/)
        res.data.items.forEach(item => {
          if (item.text.match(reg)) {
            let itemStr = item.text.match(reg).input.split(':')
            this.Bc_code = itemStr[1]
          }
        })
      }
      if (this.vailType == '2') {
        const reg = RegExp(/新生儿姓名/)
        let nameIndex = null
        res.data.items.forEach((item, index) => {
          if (item.text.match(reg)) {
            nameIndex = index
          }
        })
        this.kid_name = res.data.items[nameIndex + 1].text
        this.rank_code = res.data.items[res.data.items.length - 1].text
        // console.log(this.kid_name);
        // console.log(this.rank_code);
      }
    },
    // 识别身份证
    async ocrIdcardFun(url) {
      let res = await this.$api.ocrIdcard({
        idcard_img: url
      })
      console.log(res, '身份证信息')
      this.name = res.data.name //姓名
      this.idcard = res.data.id //身份证号
      // console.log(res);
    },
    backClick() {
      uni.navigateBack()
    },
    subClick() {
      
      switch (Number(this.vailType)) {
        case 1:
          if (!this.Bc_code) {
            this.$u.toast('请完善B超单号')
            return
          }
          let obj = {
            // name: this.name, //姓名
            // idcard: this.idcard, //身份证号
            Bc_code: this.Bc_code //B超单号
            // kid_name: this.kid_name, //孩子姓名
            // rank_code: this.rank_code, //	出生证明编号
          }
          this.showFlag = false
          this.$emit('DiscernSubData', obj)
          break
        case 2:
          if (!this.kid_name && !this.rank_code) {
            this.$u.toast('请完善出生证明')
            return
          }
          let obj2 = {
            // name: this.name, //姓名
            // idcard: this.idcard, //身份证号
            // Bc_code: this.Bc_code, //B超单号
            kid_name: this.kid_name, //孩子姓名
            rank_code: this.rank_code //	出生证明编号
          }
          this.showFlag = false
          this.$emit('DiscernSubData', obj2)
          break
        case 3:
          if (!this.idcard && !this.name) {
            this.$u.toast('请完善身份证信息')
            return
          }
          let obj3 = {
            name: this.name, //姓名
            idcard: this.idcard, //身份证号
            // Bc_code: this.Bc_code || '', //B超单号
            // kid_name: this.kid_name || '', //孩子姓名
            // rank_code: this.rank_code || '' //	出生证明编号
          }
          this.showFlag = false
          this.$emit('DiscernSubData', obj3)
          break
        default:
          break
      }
    }
  }
}
</script>

<style lang="scss" scoped>
.popupBox {
  width: 530rpx;
  box-sizing: border-box;
  padding: 32rpx;

  .title {
    font-weight: 700;
    font-size: 30rpx;
    color: #888;
    text-align: center;
  }

  .rowTitle {
    font-weight: 700;
    font-size: 27rpx;
    color: #000;
    margin: 12rpx 0;
  }

  .iptBox {
    display: flex;
    justify-content: space-between;
    align-items: center;
    color: #999;

    text {
    }

    input {
      flex: 1;
      margin-left: 10rpx;
    }
  }

  .btnBox {
    margin-top: 32rpx;
    display: flex;
    justify-content: space-between;
    align-items: center;

    text {
      width: 200rpx;
      height: 80rpx;
      border-radius: 80rpx;
      background: linear-gradient(131.2deg, rgba(179, 142, 255, 1) 0%, rgba(130, 111, 255, 1) 100%);
      line-height: 80rpx;
      text-align: center;
      color: rgba(255, 255, 255, 1);
      font-size: 28rpx;
      font-weight: 600;
    }
  }
}
</style>
